  /* 显示分数 */
  var mark = document.querySelector(".mark");
  /* 分数变量 */
  var marks = 0;
  /* 再来一局 */
  var again = document.querySelector(".again");

  /* 常量，不可修改 */
  /* 一次走的距离 */
  var STEP = 28;

  /* 容器一共18行，10列 */
  var ROW_COUNT = 18 , COL_COUNT = 10;

  /* 记录所有出现的块元素的位置 k=行_列 ：v=块元素 */
  var fixedBlocks = {}

  /* 创建每个模型的数据源 */
  var MODELS = [
      /* L型模型，里面每个盒子相对16宫格的坐标 */
      {
         0:{row:2,col:0},
         1:{row:2,col:1},
         2:{row:2,col:2},
         3:{row:1,col:2}
      },
      // 第2个模型数据源(凸)
     {
 0: {
   row: 1,
   col: 1
 },
 1: {
   row: 0,
   col: 0
 },
 2: {
   row: 1,
   col: 0
 },
 3: {
   row: 2,
   col: 0
 }
},
// 第3个模型数据源(田)
{
 0: {
   row: 1,
   col: 1
 },
 1: {
   row: 2,
   col: 1
 },
 2: {
   row: 1,
   col: 2
 },
 3: {
   row: 2,
   col: 2
 }
},
// 第4个模型数据源(一)
{
 0: {
   row: 0,
   col: 0
 },
 1: {
   row: 0,
   col: 1
 },
 2: {
   row: 0,
   col: 2
 },
 3: {
   row: 0,
   col: 3
 }
},
// 第5个模型数据源(Z)
{
 0: {
   row: 1,
   col: 1
 },
 1: {
   row: 1,
   col: 2
 },
 2: {
   row: 2,
   col: 2
 },
 3: {
   row: 2,
   col: 3
 }
}

  ]
 
  /* 变量，当前使用的模型 */  
  var currentModel = {} 
  /* 变量，16宫格的位置 */
  var currentX = 0 , currentY = 0;
  
  /* 根据模型数据源来创建块元素 */         
  function createModel() {
      /* 判断满足游戏结束条件没 */
      if(isGameOver()){
          ganmeOver();
          return;
      }
      /* 先确定创建哪个模型 */
       currentModel = MODELS[_.random(0,MODELS.length -1)];
      /* 重新初始化16宫格的位置 */
     currentX=0;
     currentY=0;
      /* 来个随机颜色 */
       let color = new Array("#FF1493","#FF00FF","#0000FF","	#1E90FF","#00FFFF","#00FF7F","#00FF00","#FFFF00","#FF6600");
       let yanse = color[Math.floor(Math.random() * color.length)];
        /* 遍历对象，生成数量的块元素 */
       for(var key in currentModel){
         var divKuai = document.createElement("div");
         divKuai.className = "kuai";
/*                 divKuai.style.backgroundColor = color ; */
         divKuai.style.cssText = `box-shadow: inset 0 0 5px ${yanse},
         inset 0 0 10px ${yanse},
         inset 0 0 15px ${yanse};
         border: 1px solid ${yanse};`
         document.getElementById("container").appendChild(divKuai);
       }
       /* 定位 */
       locationBlocks();
       /* 自动下落 */
       autoDown();
  }

  /* 根据创建好的块元素给他定位位置，生成相应的模型 */
    function locationBlocks(){
      /* 判断越界 */
     checkBound();
        /* 得到当前所有块元素 */
        var blocks = document.getElementsByClassName("kuai");
        for(var i=0;i<blocks.length;i++ ){
            /* 每个块元素 */
            var oneBlock = blocks[i];
            /* 得到每个块元素的坐标,16宫格位置加上本身相对16宫格位置 */
            var locationKuai = currentModel[i];
            oneBlock.style.top = (locationKuai.row+currentY) * STEP + "px";
            oneBlock.style.left = (locationKuai.col+currentX) * STEP + "px";
        }
    }


 /*  入口方法 */
  function rukou (){
        onKeyDown();
        createModel();
  }


  /* 用户点击键盘事件 */       
 function onKeyDown(){
     document.addEventListener('keydown',function(event){
          
          switch(event.keyCode){
              case 38: console.log("shang"); 
              rotate();
              break;
              case 39: console.log("you"); 
              move(1,0);
              break;
              case 40: console.log("xia");
              move(0,1);
               break;
              case 37: console.log("zuo");
              move(-1,0);
               break;

          }
     })
 }
